import { CITYS, ObjectType } from "esy-tools"
import { Picker } from "esy-ui"
import React from "react"

const rawColumns = [
    [
        { text: "第一列-1", key: 1 },
        { text: "第一列-2", key: 2 },
        { text: "第一列-3", key: 3 },
        { text: "第一列-4", key: 4 },
        { text: "第一列-5", key: 5 },
        { text: "第一列-6", key: 6 },
        { text: "第一列-7", key: 7 },
        { text: "第一列-8", key: 8 }
    ]
]

const rawColumnss = [
    [
        { text: "第一列-1", key: 1 },
        { text: "第一列-2", key: 2 },
        { text: "第一列-3", key: 3 },
        { text: "第一列-4", key: 4 },
        { text: "第一列-5", key: 5 },
        { text: "第一列-6", key: 6 },
        { text: "第一列-7", key: 7 },
        { text: "第一列-8", key: 8 }
    ],
    [
        { text: "第二列-1", key: 1 },
        { text: "第二列-2", key: 2 },
        { text: "第二列-3", key: 3 },
        { text: "第二列-4", key: 4 },
        { text: "第二列-5", key: 5 },
        { text: "第二列-6", key: 6 },
        { text: "第二列-7", key: 7 },
        { text: "第二列-8", key: 8 },
        { text: "第二列-9", key: 9 }
    ],
    [
        { text: "第三列-1", key: 1 },
        { text: "第三列-2", key: 2 },
        { text: "第三列-3", key: 3 },
        { text: "第三列-4", key: 4 },
        { text: "第三列-5", key: 5 },
        { text: "第三列-6", key: 6 },
        { text: "第三列-7", key: 7 },
        { text: "第三列-8", key: 8 },
        { text: "第三列-9", key: 9 },
        { text: "第三列-10", key: 10 }
    ]
]

const dataMap: Record<number, []> = {
    1: rawColumns,
    2: rawColumnss,
    3: CITYS
}

export const Demo = ({ dataType, ...rest }: ObjectType) => {
    return <Picker options={dataMap[dataType]} {...rest} />
}

export const demoJson = (str = "", type = "1") => `
import { Picker } from "esy-ui"
${type === "3" ? 'import { CITYS } from "esy-tools"' : ""}
import React from "react"

export const Demo = () => {

const options = ${type === "3" ? "CITYS" : JSON.stringify(dataMap[type])}

    return (
        <Picker options={options} ${str} />
    )
}
`
